<template>
    <div class="designer">
        <!-- 布局容器组件 -->
        <container-component />
        <!-- 输入框组件列表 -->
        <input-component />
        <!-- 下拉框组件列表 -->
        <select-component />
        <!-- 日期时间选择组件列表 -->
        <date-time-picker />
        <!-- 选择框 -->
        <check-box />
    </div>
</template>
<script>
import ContainerComponent from './container'
import InputComponent from './input'
import SelectComponent from './select'
import DateTimePicker from './dateTimePicker.vue'
import CheckBox from './checkbox'
export default {
    components: {
        InputComponent,
        SelectComponent,
        ContainerComponent,
        DateTimePicker,
        CheckBox
    }
}
</script>
<style lang="scss" scoped>
.designer {
    @include box_flex(
        $width: 100%,
        $height: 100%,
        $direction: column,
        $justify: flex-start,
        $align: center
    );
}
</style>
